<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" type="text/css" href="css/root.css?var=10"/>
    <link rel="stylesheet" type="text/css" href="css/account/user.css?var=10"/>
    <link rel="stylesheet" type="text/css" href="css/order/order.css?var=10"/>
    <script type="text/javascript" src="js/base/jquery-3.1.1.min.js?ver=2.0.4" charset="utf-8"></script>
    <script type="text/javascript" src="js/base/underscore-min.js"></script>
    <script type="text/javascript" src="js/base/moment.min.js"></script>
    <script src="js/base/api.js?var=10"></script>
    <script src="js/base/magiclamp.js"></script>
    <script src="js/base/base.js"></script>
    <script src="js/base/vue-filter.js"></script>
    <script src="js/base/vue.js"></script>
    <script src="js/tuishou_goods.js?a=7"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>


    <!-- Core CSS file -->
    <link rel="stylesheet" href="photoswipe/photoswipe.css">

    <!-- Skin CSS file (styling of UI - buttons, caption, etc.)
         In the folder of skin CSS file there are also:
         - .png and .svg icons sprite,
         - preloader.gif (for browsers that do not support CSS animations) -->
    <link rel="stylesheet" href="photoswipe/default-skin/default-skin.css">

    <!-- Core JS file -->
    <script src="photoswipe/photoswipe.min.js"></script>

    <!-- UI JS file -->
    <script src="photoswipe/photoswipe-ui-default.min.js"></script>

    <title>我来推一推</title>

</head>
<body class="whitesmoke">
<!--订单-->
<div id="orderlist">
    <div class="com-tag" id="order-tab">
        <a href="#" :class="show_index==0?'tag-on':''" @click="show_index=0"><span>推荐商品</span></a>
        <a href="#" :class="show_index==1?'tag-on':''" @click="show_index=1"><span>分享页面</span></a>
    </div>

    <!--未付款-->
    <div class="unfinished-order" v-if="show_index==0">
        <div class="order-item g-wrap" v-if="order.is_active" v-for="(order,index) in good_comment_list">

            <div class="my-order-title line">
                <div style="display: flex;flex-direction: row;width: 100%;">
                    <div style="flex-grow: 0;flex-shrink: 1" @click="go_goods_detail(order.goods_id)">
                        <img :src="baseConfig.qn_host + order.goods__small_image__fileurl+'?imageView2/1/w/50/h/50'">
                    </div>

                    <div style="display: flex;flex-direction: column;flex-grow: 1;flex-shrink: 1; margin-left: 0.5rem; "
                         @click="go_goods_detail(order.goods_id)">
                        <div >
                            {{order.goods__name}}
                        </div>
                        <span class="order-goods-price" style="color: #ff3f38;"
                              v-text="price_filter(order.goods__price-order.goods__bu_tie_price)"></span>
                    </div>

                    <div style="flex-grow: 0;flex-shrink: 1">
                        <label class="font-red">
                            <input class="address-radio" type="checkbox" :value="order.id" v-model="select_tuijian">
                        </label>
                    </div>
                </div>


            </div>

            <div class="my-order-title line">
                <div style="width: 90%;">
                    <span v-if="!order.hide" style="font-size: 1.4rem;">{{order.content}}</span>
                    <span v-if="order.hide">没有评价</span>

                </div>
                <a href="javascript:void(0);" @click="edit_pingjia(order)"
                   style="float: right;margin-right: 0.5rem;font-size: 1.2rem;color:blue;"
                ><u>编辑</u></a>

            </div>
            <div class="my-order-title line" v-if="order.file_type==1">
                <div style="display: flex;flex-direction: row;flex-wrap: wrap;">

                    <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/105/h/105'" width="32%"
                         @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length>1"
                         v-for="img in order.files_json">
                    <img style="margin: 0.1rem;" :src="baseConfig.qn_host + img.fileurl+'?imageView2/1/w/350/h/350'" width="65%"
                         @click="show_big_pengyou_img(order, img.fileurl)" v-if="order.files_json.length==1"
                         v-for="img in order.files_json">

                </div>
            </div>
            <div class="my-order-title line pengyou_video" v-if="order.file_type==2&&order.video_obj.id">
                <video :src="baseConfig.qn_host + order.video_obj.fileurl" :id="'video'+order.id"
                       style="width:100%;"
                       x-webkit-airplay="true" preload="auto"
                       x5-video-player-type="h5" webkit-playsinline="true"
                       controls
                       playsinline
                       :poster="get_fengmian(order.video_img__fileurl, order.goods__small_image__fileurl)"
                >

                </video>
            </div>

        </div>
        <div class="more" @click="query_goods_tuijian_by_user_list" v-if="good_page_index!=good_page_count">加载更多……
        </div>
        <div class="com-notice" v-if="good_comment_list.length==0">
            <div class="icon-wrap">
                <i class="iconfont icon-dingdan"></i>
            </div>
            <p>暂无数据</p>
        </div>
        <br/>
        <br/>
        <br/>
        <br/>
        <div style="position: fixed;
  bottom: 0px;
  left: 0;
  right: 0;
  height: 50px;
  z-index: 1002;
  background-color: #f9f9f9;
  padding: 5px;
  text-align: center;">
            <button class="btn btn-sm " @click="delete_tuijian()" style="color: #ff3f38">删除</button>
            &nbsp;&nbsp;&nbsp;
            <button class="btn btn-sm " @click="create_page()">创建推荐页</button>
        </div>
    </div>
    <!--已付款-->
    <div class="finished-order" v-if="show_index==1">
        <div style="height: 2.4rem; padding-top: 0.4rem;">
            <img src="img2/pic_yhtj.png" style="width: 8rem;" />
        </div>
        <div class="order-item g-wrap" v-if="order.is_active" v-for="(order,index) in bad_comment_list">
            <div class="my-order-title line">
                <div style="display: flex;flex-direction: row; width: 100%;">
                    <div style="flex-grow: 1;flex-shrink: 0" @click="go_tuijian_detail(order)">
                        {{order.name}}
                    </div>

                    <div style="flex-grow: 0;flex-shrink: 1">
                        <label class="font-red">
                            <input class="address-radio" type="checkbox" :value="order.id"
                                   v-model="select_tuijian_page">
                        </label>
                    </div>
                </div>


            </div>

            <div class="more" @click="query_goods_tuijian_page_by_user_list" v-show="bad_page_index!=bad_page_count">
                加载更多……
            </div>
            <div class="com-notice" v-if="bad_comment_list.length==0">
                <div class="icon-wrap">
                    <i class="iconfont icon-dingdan"></i>
                </div>
                <p>暂无数据</p>
            </div>
            <div style="position: fixed;
  bottom: 0px;
  left: 0;
  right: 0;
  height: 50px;
  z-index: 1002;
  background-color: #f9f9f9;
  padding: 5px;
  text-align: center;">
                <button class="btn btn-sm " @click="delete_tuijian_page()" style="color: #ff3f38">删除</button>
            </div>
        </div>
        <div style="height: 2.4rem; padding-top: 0.4rem;">
            <img src="img2/pic_pttj.png" style="width: 8rem;" />
        </div>
        <div class="order-item g-wrap" v-if="order.is_active" v-for="(order,index) in sys_comment_list">
            <div class="my-order-title line">
                <div style="display: flex;flex-direction: row; width: 100%;">
                    <div style="flex-grow: 1;flex-shrink: 0" @click="go_tuijian_sys(order)">
                        {{order.name}}
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="all_pengyou_images" v-if="show_pengyou_dongtai_images">
        <div class="pswp" id="all_pengyou_pswp" tabindex="-1" role="dialog" aria-hidden="true">

            <!-- Background of PhotoSwipe.
                 It's a separate element as animating opacity is faster than rgba(). -->
            <div class="pswp__bg"></div>

            <!-- Slides wrapper with overflow:hidden. -->
            <div class="pswp__scroll-wrap">

                <!-- Container that holds slides.
                    PhotoSwipe keeps only 3 of them in the DOM to save memory.
                    Don't modify these 3 pswp__item elements, data is added later on. -->
                <div class="pswp__container">
                    <div class="pswp__item"></div>
                    <div class="pswp__item"></div>
                    <div class="pswp__item"></div>
                </div>

                <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
                <div class="pswp__ui pswp__ui--hidden">

                    <div class="pswp__top-bar">

                        <!--  Controls are self-explanatory. Order can be changed. -->

                        <div class="pswp__counter"></div>

                        <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>


                        <!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
                        <!-- element will get class pswp__preloader--active when preloader is running -->
                        <div class="pswp__preloader">
                            <div class="pswp__preloader__icn">
                                <div class="pswp__preloader__cut">
                                    <div class="pswp__preloader__donut"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                        <div class="pswp__share-tooltip"></div>
                    </div>

                    <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
                    </button>

                    <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
                    </button>

                    <div class="pswp__caption">
                        <div class="pswp__caption__center"></div>
                    </div>

                </div>

            </div>

        </div>
    </div>
</div>
</body>
</html>